<template>
	<view>
		<!-- 选择切换 -->
		<view class="u-p-30">
			<view><text class="tl">切换身份({{list.length}})</text></view>
		</view>
		<u-cell-group>
			<u-cell-item
				v-for="(item, index) in list" 
				:key="index" 
				:arrow="false"
				@click="changeIdentities(item)"
				>
				<view slot="title" style="display: flex;align-items: center;">
					<text class="u-font-32">{{item.name}}</text>
				</view>
				<view slot="label">
					<text class="">{{item.label}}</text>
				</view>
				<text v-if="type == item.value" class="u-type-primary" style="text-decoration: underline;">当前身份</text>
				<u-button v-else type="primary" size="mini" @click="changeIdentities(item)">切换身份</u-button>
			</u-cell-item>
		</u-cell-group>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	
	export default {
		name:"identities-list",
		// props:{
		// 	show: {
		// 		type: Boolean,
		// 		default(){
		// 			return false
		// 		}
		// 	}
		// },
		data() {
			return {
				// show: false,
				list: [
					{
						name: '用户端',
						label: '点击切换小程序普通用户',
						value: 1
					},
					// {
					// 	name: '我是小哥',
					// 	label: '点击切换小哥',
					// 	value: 3
					// },
					// {
					// 	name: '我是驿站店员',
					// 	label: '点击驿站店员',
					// 	value: 4
					// }
				],
				type: 1,
				userDetails: {}
			};
		},
		computed: {
			...mapState({
				userdetail: state => state.userdetail
			}),
			// 是否运营商管理员
			isOperatorAdmin(){
				try {
					return this.userdetail.bindinfo.operator.ismanager
				} catch (error) {
					//TODO handle the exception
					return false
				}
			},
			// 是否加盟商管理员
			isFranchiseAdmin(){
				try {
					return this.userdetail.bindinfo.operator.franchiselist.filter((item)=>item.ismanager == true).length > 0
				} catch (error) {
					//TODO handle the exception
					return false
				}
			},
			// 是否（当前）站点的管理员
			isStoreAdmin(){
				try {
					return this.userdetail.bindinfo.operator.franchiselist.find((item)=>item.id == this.franchiseId).storelist.find((item)=>item.id == this.storeId).ismanager
				} catch (error) {
					//TODO handle the exception
					return false
				}
			}
		},
		mounted() {
			this.type = uni.getStorageSync('selectUserType') || 1
			
			this.$store.dispatch('getDetails').then((res)=>{
				// 查看是否归属于某个运营商下
				const operator = res.bindinfo.operator
				// brotherfranchiseid为小哥所在运营商id，大于0即为该运营商的小哥
				if(operator.brotherfranchiseid > 0){
					this.list.push({
						name: '猿哥端',
						label: `上门回收订单与站点运输操作端`,
						value: 3,
						operatorid: operator.id,
						franchiseid: operator.brotherfranchiseid
					})
				}
				
				// 查看运营商下有多少运营组
				const franchiselist = operator.franchiselist
				let allStoreList = []
				if(franchiselist.length > 0){
					franchiselist.forEach((cell)=>{
						
						cell.storelist.forEach((con)=>{
							con.franchiseId = cell.id
						})
						const storelist = cell.storelist
						if(storelist.length > 0){
							// 判断我至少有可切换站点的权限（是管理员或店员）
							const hasValid = storelist.some(item => item.ismanager || item.isstaff);
							if(hasValid){
								if(this.list.filter((listItem)=>listItem.value == 4).length == 0){
									this.list.push({
										name: '店员端',
										label: `站点线下回收及出入库操作端`,
										value: 4,
										operatorid: operator.id,
										type: 'shop'
									})
								}
								storelist.map((storeItem)=>{
									storeItem.franchiseId = cell.id,
									storeItem.franchiseName = cell.name
									// storeItem.hasValid = true  //表示可切换
								})
								allStoreList.push(...storelist)
							}
						}
					})
				}
				console.log('我的站点:',allStoreList.filter((item)=>item.usestate == '已启用').filter((item)=>item.ismanager == true || item.isstaff))
				uni.setStorageSync('allStoreList',allStoreList.filter((item)=>item.usestate == '已启用').filter((item)=>item.ismanager == true || item.isstaff))
				
				if(this.isFranchiseAdmin){
					this.list.push({
						name: '加盟商端',
						label: `加盟商管理员操作端`,
						value: 6,
						operatorid: operator.id,
						type: 'franchise'
					})
				}
				if(this.isOperatorAdmin){
					this.list.push({
						name: '运营商端',
						label: `运营商管理员操作端`,
						value: 5,
						operatorid: operator.id,
						type: 'operator'
					})
				}
				
				if(this.list.length > 1){
					this.$emit('allow',true)
				}
			}).catch(()=>{
				
			}).finally(()=>{
				
			})
		},
		methods: {
			// 切换身份
			changeIdentities(item){
				uni.setStorageSync('selectUserType',item.value)
				switch (item.value){
					case 1:
						this.$u.vuex('userType', 1)
						// 用户
						uni.switchTab({
							url: '/pages/user/user'
						})
						break;
					case 3:
						// // #ifdef MP-WEIXIN
						// if(!this.userDetails.serviceopenid){
						// 	uni.login({
						// 		provider: 'weixin', //使用微信登录
						// 		success: ret => {
						// 			var code = ret.code
						// 			this.$u.get('/User/Account/BindingWeiXin?code=' + code+'&isMiniProgram=true').then(data => {
						// 				if (data.status == 0) {
						// 					console.log(data.msg)
						// 				}
						// 			})
						// 		}
						// 	})
						// }
						// // #endif
						this.$u.vuex('userType', 3)
						this.$u.vuex('operatorid', item.operatorid)
						this.$u.vuex('franchiseId', item.franchiseid)
						// 小哥
						uni.reLaunch({
							url: '/pages/brother/index/index'
						})
						break;
					case 4:
						// 站点店员(包括站点管理员)、加盟商管理员、运营商管理员header传的userType都是4
						this.$u.vuex('userType', 4)
						this.$u.vuex('operatorid', item.operatorid)
						uni.reLaunch({
							url: '/pages/shop/index/index'
						})
						break;
					case 5:
						this.$u.vuex('userType', 4)
						this.$u.vuex('operatorid', item.operatorid)
						uni.reLaunch({
							url: '/pages/admin/index/index'
						})
						break;
					case 6:
						this.$u.vuex('userType', 4)
						this.$u.vuex('operatorid', item.operatorid)
						uni.reLaunch({
							url: '/pages/admin/franchise/index/index'
						})
						break;
					default:
						break;
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.change-tag {
		border: 1px solid $u-color-main;
		height: 62rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 20rpx;
		border-radius: 72rpx;
		width: 240rpx;
		margin: 0 auto;
		.name{
			color: $u-color-main;
		}
	}
	.ico-color{
		color: $u-color-main;
	}
	.tl{
		color: #606266;
		font-size: 32rpx;
	}
</style>